import {BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import RouterArr from './router/index'
import { useSelector } from 'react-redux'
import './App.css';
// import ComponentTabber from './components/Tabber/index'
import ComponentHeader from './components/header/index'
import ComponentMusic from './components/music/index'
// import home from './router/tabber'
import { useEffect, useState, useCallbackState } from 'react'
function App() {
  // const playSong = useSelector(state => state.playSong)
  // const [musicShow, setMusicShow] = useState(false)
  // useEffect(() => {
  //   setMusicShow(playSong || false)
  // }, [playSong])
  // const [data,setData] = useCallbackState('1');
  // setData({}, function (data) {
  // console.log("啦啦啦，我是回调方法", data);
  // })
  return (
    <Router>
      {/* <div>{data}</div> */}
      {/* <Header></Header> */}
      <Switch>
        
      { 
        RouterArr.map((item) => {
          return <Route exact= { item.exact || false } title={item.title} path={item.path} component={item.component} key={item.name} />  
        })
      }
       </Switch>
      <ComponentMusic></ComponentMusic>
      {/* <Musicing /> */}
    {/* <ComponentTabber data={home}></ComponentTabber> */}
    </Router>
  );
}
function Header() {
  return (
    <ComponentHeader></ComponentHeader>
  )
}
export default App;
